// pages/category/category.js
import { request } from '../../request/index.js';
// 异步处理同步化
import regeneratorRuntime from '../../lib/runtime/runtime';
Page({
  data: {
    // 左侧导航数据
    leftMenuList: [],
    // 右侧导航数据
    rightMenuList: [],
    // 被点击的左侧菜单
    currentIndex: 0,
    // 右侧内容的scroll-view距离顶部的距离
    scrollTop:0,
  },
  // 返回的所有导航数据
  cateGoryList: [],
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    /* 缓存技术
      1. 先判断一下本地中有没有旧数据 {time:Date.now() , data:[...]}
      wx.setStorage({
        key: 'cates',
        data: {time:Date.now(),data:this.cateGoryList}
      });
      2. 没有旧数据，直接发送请求
      this.getCateGoryList();
      3. 有旧数据 并没过去 就使用本地旧数据
    */
    // 1.获取本地存储中的数据
    const Cates = wx.getStorageSync('cates');
    // 2.判断
    if (!Cates) {
      // 不存在，发送请求获取数据
      this.getCateGoryList();
    }else{
      // 有旧数据,定义过期时间 10s
      if(Date.now()-Cates.time > 1000*60*5){
        // 发送请求
        this.getCateGoryList();
      }else{
        // 将本地数据赋值给cateGoryList
        this.cateGoryList = Cates.data;
        // 构造左侧导航数据
        let leftMenuList = this.cateGoryList.map(item => item.cat_name);
        // 构造右侧商品数据
        let rightMenuList = this.cateGoryList[0].children;
        // 渲染数据
        this.setData({ leftMenuList, rightMenuList })
      }
    }
  },
  // 获取分类数据
  async getCateGoryList() {
    request({ url: "/categories" })
      .then(res => {
        this.cateGoryList = res;
        // 把接口的数据存入到本地存储中，解决性能问题
        wx.setStorage({
          key: 'cates',
          data: { time: Date.now(), data: this.cateGoryList }
        });
        // 构造左侧导航数据
        let leftMenuList = this.cateGoryList.map(item => item.cat_name);
        // 构造右侧商品数据
        let rightMenuList = this.cateGoryList[0].children;
        // 渲染数据
        this.setData({ leftMenuList, rightMenuList })
      })

    // // 1.使用es7的asnc await来发送请求
    // const res = await request({ url: "/categories"});
    // this.cateGoryList = res;
    // // 把接口的数据存入到本地存储中，解决性能问题
    // wx.setStorage({
    //   key: 'cates',
    //   data: { time: Date.now(), data: this.cateGoryList }
    // });
    // // 构造左侧导航数据
    // let leftMenuList = this.cateGoryList.map(item => item.cat_name);
    // // 构造右侧商品数据
    // let rightMenuList = this.cateGoryList[0].children;
    // // 渲染数据
    // this.setData({ leftMenuList, rightMenuList })
  },
  // 点击事件，改变左侧选中导航索引
  handleIntemTap(e) {
    const { index } = e.currentTarget.dataset;
    // 构造右侧商品数据
    let rightMenuList = this.cateGoryList[index].children;
    // scrollTop 重新设置 右侧内容的scroll-view距离顶部的距离
    // 渲染数据
    this.setData({
      currentIndex: index,
      rightMenuList,
      scrollTop:0
    })

  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})